<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <title>
    <%= webpackConfig.name %>
  </title>
  <% for(var css of htmlWebpackPlugin.options.cdn.css) { %>
    <link rel="stylesheet" href="<%=css%>">
  <% } %>
  <style>
    #live2d-widget #live2dcanvas {
      left: 1520px !important;
      bottom: -400px !important;
      opacity: 1 !important;
      z-index: 999 !important;
    }
  </style>
</head>

<body>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
  <noscript>
    <strong>We're sorry but <%= webpackConfig.name %> doesn't work properly without JavaScript enabled. Please enable it
        to continue.</strong>
  </noscript>
  <div id="app"></div>
  <% for(var js of htmlWebpackPlugin.options.cdn.js) { %>
    <script src="<%=js%>"></script>
  <% } %>
</body>

<script>
  L2Dwidget.init({
    "model": {
      jsonPath: "https://unpkg.com/live2d-widget-model-hibiki/assets/hibiki.model.json",//这里改模型，前面后面都要改
      "scale": 1
    },
    "display": {
      "position": "left",//设置看板娘的上下左右位置
      "width": 200,
      "height": 500,
      "hOffset": 70,
      "vOffset": 70
    },
    "mobile": {
      "show": true,
      "scale": 0.5
    },
    "react": {
      "opacityDefault": 0.7,//设置透明度
      "opacityOnHover": 0.2
    }
  });
  window.onload = function () {
    $("#live2dcanvas").attr("style", "position: fixed; opacity: 0.7; left: 170px; bottom: 0px; z-index: 1; pointer-events: none;")
  }
</script>

</html>